<template>
    <div class="loginin_component">
        <div class="loginin_main">
            <div class="main_title">
                <h2 class="one">欢迎登录</h2>
                <h2 class="two">网娱大师后台管理</h2>
            </div>
            <el-form :model="form" :rules="rules" ref="form" label-width="80px">
                <el-form-item label="用户名:" prop="name">
                    <el-input v-model="form.name"></el-input>
                </el-form-item>
                <el-form-item label="密码:" prop="pwd">
                    <el-input type="password" v-model="form.pwd"></el-input>
                </el-form-item>
                <el-form-item>
                    <el-button type="primary" @click="onSubmit('form')">登录</el-button>
                </el-form-item>
            </el-form>
        </div>
        <div class="footer">
            <p>
                <a href="http://www.wangyuhudong.com" target="_blank" class="gowy">Copyright © 2015-2016
                    浙江网竞网络科技有限公司,未经许可不得复制、转载或摘编，违者必究！ </a>
            </p>
            <p>浙ICP备13005497号-5</p>
        </div>
    </div>
</template>
<script>
    export default {
        name: "loginIn",
        data() {
            return {
                form: {
                },
                rules: {
                    name: [
                        { required: true, message: '请输入用户名', trigger: 'blur' }
                    ],
                    pwd: [
                        { required: true, message: '请输入密码', trigger: 'blur' }
                    ],
                }
            }
        },
        mounted: function () {

        },
        methods: {
            onSubmit(formName){
                this.$refs[formName].validate((valid) => {
                    if (valid) {
                        var params = this.form;
                        this.axios
                            .post("shop/admin/login", params)
                            .then(res => {
                                var _data = res.data;
                                if (_data.code == 200) {
                                    this.$router.push({
                                        path: '/gameAccount'
                                    });
                                    window.sessionStorage.setItem('username',params.name);
                                    
                                }else{
                                    this.$message.error(_data.message);
                                }
                            })
                            .catch(error => console.log(error));
                    } else {
                        console.log('error submit!!');
                        return false;
                    }
                });
            }
        },
    }
</script>
<style lang="less">
    .loginin_component {
        flex: 1;
        background: #f5f7fa;
    }

    .el-input {
        width: 300px;
    }

    .loginin_main {
        width: 100%;
        padding: 20px 0 50px;
        margin: 20px auto 10px;

        .main_title {
            text-align: center;
        }

        .el-form {
            margin-top: 50px;

            .el-form-item {
                display: flex;
                justify-content: center;

                .el-form-item__content {
                    margin-left: 10px !important;
                }
            }
        }
    }




    .footer {
        text-align: center;

        .gowy {
            color: #333;
            text-decoration: none;
        }
    }
</style>